import Tabs, { TabsProps } from '@/components/Tabs';
import { DATABASE_TYPE_ENUM, fetchDictInfo } from '@/utils';
import React, { useEffect, useState } from 'react';
import { useIntl } from 'umi';
import LoginLog from './components/LoginLog';

const App: React.FC = () => {
  const [orgType, setOrgType] = useState<string>('0');
  const [orgDirc, setorgDirc] = useState<any>(null);
  const setOrgTypeCall = (res: string) => {
    setOrgType(res);
  };
  const intl = useIntl();

  useEffect(() => {
    fetchDictInfo(DATABASE_TYPE_ENUM.OPERATE_TYPE).then((res) => {
      setorgDirc(res);
    });
  }, []);

  const items: TabsProps['items'] = [
    {
      key: '0',
      label: intl.formatMessage({ id: 'systemManagement.systemLogMenu.loginLog' }),
      children: <LoginLog orgType={orgType} orgDirc={orgDirc} />,
    },
    {
      key: '1',
      label: intl.formatMessage({ id: 'systemManagement.systemLogMenu.systemLog' }),
      children: <LoginLog orgType={orgType} orgDirc={orgDirc} />,
    },
  ];

  return (
    <div>
      <Tabs items={items} onChange={setOrgTypeCall} />
    </div>
  );
};

export default App;
